import React from "react";
import { Input } from "antd";
import { useFormField } from "../../context/form-context";
import set from "lodash/set"
let defaultConfig = {
  //这一批属性来源 tplData.form.data_control （步骤权限）
  // "code": "a1",
  // "name": "a1",
  // "type": "single_text",
  // "is_show": true,
  // "is_editable": true,
  // "is_required": false,

  //这一批属性来源 tplData.form.form_meta_data （表单设计器）
  // "isUsed": false,
  // "designProps": {
  //     "code": "a1",
  //     "name": "a1",
  //     "ui": "wfd_textbox",
  //     "title": "a1",
  //     "layout": "control_layout_leftRight",
  //     "defaultValue": "",
  //     "text": "请输入a1",
  //     "groupTitle": "",
  //     "byTableGroupTitle": false,
  //     "tipstext": "",
  //     "type": "single_text",
  //     "title_w": 85
  // },
  
  //这一批属性来源 tplData.form.data_define （业务对象）
  // "show_type": "",
  // "show_type_name": "",
  "props": {
      "max_length": 500,
      // "source_type": "fixd_value",
      // "configs": "",
      // "default_value": ""
  },
  // "type_name": "单行文本",
  
  //来源 tplData.form.defaultValueConf
  // "default": null
}

//输入框组件
export default function MyInput({ id, field, label, rules, showLabel = false, onChange, onBlur, displayFormatter, valueFormatter, cell, required, rowIndex, ...others }) {
  
  if(cell?.props?.max_length === undefined){
    set(cell, "props.max_length", defaultConfig.props.max_length);
  }//防止max_length丢失

  const { input, property, readonly, className, isDisplay } = useFormField({
    field,
    rules,
    onChange,
    displayFormatter, 
    valueFormatter, 
    onBlur,
  });
  //如果是只读模式，直接返回字段的值
  if (isDisplay) {
    return input.value === undefined ? null : input.value;
  }
  let component = <Input maxLength={cell?.props?.max_length} placeholder={cell?.designProps?.text? cell?.designProps?.text:"请输入"} className={className} {...input} disabled={property.disabled} {...others} {...readonly}></Input>;
  return component;
}
